<% extends 'public/base.html'%>
<% block content %>
<link rel="stylesheet" href="<< url_for('static', filename='css/monitor.css') >>">
<div class="cont body_content">
    <div class="monitor-layer">
        <div class="title">
            <p id="time"></p>
        </div>
        <div class="monitor-main">
            <div class="layui-col-md4 layui-col-sm-12 layui-col-xl-4"><div id="l1" class="block show"></div></div>
            <div class="layui-col-md4 layui-col-sm-12 layui-col-xl-4">
                <div id="c1" class="block">
                    <div class="num">
                        <h1></h1>
                    </div>
                    <div class="num">
                        <h1></h1>
                    </div>
                    <div class="num">
                        <h1></h1>
                    </div>
                    <div class="num">
                        <h1></h1>
                    </div>
                    <div class="txt">
                        <h2>累积确诊</h2>
                    </div>
                    <div class="txt">
                        <h2>剩余疑似</h2>
                    </div>
                    <div class="txt">
                        <h2>累积治愈</h2>
                    </div>
                    <div class="txt">
                        <h2>累积死亡</h2>
                    </div>
                </div>
            </div>
            <div class="layui-col-md4 layui-col-sm-12 layui-col-xl-4"><div id="l2" class="block show"></div></div>
            <div class="layui-col-md6 layui-col-sm-12 layui-col-xl-6"><div id="c2" class="block show"></div></div>
            <div class="layui-col-md6 layui-col-sm-12 layui-col-xl-6"><div id="r1" class="block show"></div></div>
        </div>
    </div>
</div>
<script src="https://cdn.jsdelivr.net/npm/jquery@1.11.3/dist/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/echarts.min.js?_v_=1598903772045"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/map/js/china.js?_v_=1598903772045"></script>
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/echarts/dist/extension/bmap.js?_v_=1598903772045"></script>
<script src="<< url_for('static', filename='js/charts/ec_center.js') >>"></script>
<script src="<< url_for('static', filename='js/charts/ec_left1.js') >>"></script>
<script src="<< url_for('static', filename='js/charts/ec_left2.js') >>"></script>
<script src="<< url_for('static', filename='js/charts/ec_right1.js') >>"></script>
<script src="<< url_for('static', filename='js/charts/controller.js') >>"></script>
<% endblock %>
<% block script%>

    var siteDir = $('.site-dir');
      if(siteDir[0] && $(window).width() > 750){
        layer.ready(function(){
          layer.open({
            type: 1
            ,content: siteDir
            ,skin: 'layui-layer-dir'
            ,area: 'auto'
            ,maxHeight: $(window).height() - 300
            ,title: '导航'
            //,closeBtn: false
            ,offset: 'r'
            ,shade: false
            ,success: function(layero, index){
              layer.style(index, {
                marginLeft: -15
              });
            }
          });
        });
    siteDir.find('li').on('click', function(){
      var othis = $(this);
      othis.find('a').addClass('layui-this');
      othis.siblings().find('a').removeClass('layui-this');
    });
    }
    $('.show').click(function(){
        var source=$(this).find('canvas');
        source.removeClass('show');
        var index=layer.open({
          type: 1,
            shade: 0,
            title: '查看',
            shadeClose:true,
            area:[source[0].width+'px',(source[0].height+51)+'px'],
            content: source
        });
    });
<% endblock %>